<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="header/h5header::h5header('帅小铺-实体商户社群服务平台',
'/assets/H5/css/ask.css,/assets/H5/css/bus.css',
'/assets/H5/js/flexible.js')">
</head>
<body style="font-size: 16px;">
<div class="container  container-ask" style="padding-top: 0">
	<header class="header03 header-top-0">
		<div class="top">
			<a class="return" href="/">
				<span class="icon icon-return"></span>
			</a>
			<div class="location">
				<a href="/city">
					<span class="icon icon-location"></span>
					<span th:text="${cityname}"></span>
				</a>
			</div>
			<div class="logo">
				<a href="/">
					<img src="/assets/H5/images/hlogo.png" alt="">
				</a>
			</div>
			<div class="search-ico">
				<a href="#">
					<span class="icon icon-search"></span>
				</a>
			</div>
			<div class="user">
				<a class="need-login" href="/u/profile">
					<span class="icon icon-user"></span>
				</a>
			</div>
		</div>
	</header>
	<div class="center " style="">
		<!--banner-->
		<div class="ask-banner ask-list-banner">
			<!--banner-->
			<div class="pic">
				<img src="/assets/H5/images/img-ask-banner2.png" alt="">
			</div>
			<h4>买房，从问问开始</h4>
			<p>帅小铺承诺：所有问答均来自真实用户和咨询师购房交流过程中</p>
			<!--搜索-->
			<div class="search-wrap ask-list-search">
				<div class="search">
					<form>
						<div class="ipt-area">
							<div class="ipt-area">
								<input type="text" class="ipt" name="query" placeholder="搜你想知道的问题、答案">
							</div>
						</div>
						<div class="ipt-close">
							<span class="ico ico-close"></span>
						</div>
						<div class="btn-area">
							<button type="button" class="btn-search">
								<span class="icon icon-search"></span>
							</button>
						</div>
					</form>
				</div>
			</div>
		</div>
		<!--问答列表-->
		<div class="ask-row">
			<div class="ask-list">
				<!--检索条件-->
				<div class="filter">
					<div class="filter-list">
						<li class="on" lay-event="seac" data-id="">
							<a href="javascript:void(0)">
								<span>全部</span>
							</a>
						</li>
						<li th:each="item:${questionType}" th:attr="data-id=${item.qid}" lay-event="seac">
							<a href="javascript:void(0)">
								<span th:text="${item.questionType}"></span>
							</a>
						</li>
					</div>
				</div>
				<div class="ask-item-wrap" id="wdList"></div>
				<div class="go-ask go-ask-project" style="display: none">
					<p>没有更多问答啦，更多疑问可以直接提问哦~</p>
					<div class="btn-area">
						<button type="button" class="btn btn-look common-call">去提问</button>
					</div>
				</div>
			</div>
		</div>
		<div class="float-ask a-footer-layer">
			<div class="go-ask">
				<div class="btn-area">
					<a href="javascript:void(0)">
						<button type="button" class="btn btn-find common-call">我要提问</button>
					</a>
					<a class="julive_m_four_zero_zero click_op_act" href="tel:400-680-2528">
						<button class="btn btn-consult">提问热线</button>
					</a>
				</div>
			</div>
		</div>
		<!--提示框-->
		<!--返回顶部-->
		<div class="return-top return-top2" style="display: none;">
			<span class="icon icon-return-top2"></span>
		</div>
	</div>
</div>
	
<script type="text/html" id="itemlist">
<div class="ask-item">
	<div class="ask-tit">
		<a href="/ask/236399">
			<div class="ask-wlogo">
				<img src="/assets/H5/images/icon-question.png" alt="icon-question" title="icon-question">
			</div>
			<div class="ask-tit-wrap">
				<h4>{{d.question}}</h4>
				<div class="ask-info">
					<div class="asker-info">
						<div class="asker">{{d.userName}}</div>
					</div>
					<div class="ask-source">{{d.time}}</div>
				</div>
			</div>
		</a>
	</div>
	<div class="ask-con">
		<a href="/ask/236399">
			<div class="ask-dlogo">
				<img src="/assets/H5/images/icon-answer.png" alt="icon-answer" title="icon-answer">
			</div>
		</a>
		<div class="ask-answer">
			<a href="/ask/236399">
				<!-- 纯文字 -->
				<div class="ask-detail">
					<div class="text">{{d.answer}}</div>
				</div>
			</a>
			<div class="interactive">
				<!--回答者信息-->
				<a href="/ask/236399">
					<div class="answerer">
						<div class="pic">
							<img class="lazy" src="{{d.avatar}}" alt="{{d.name}}" style="display: block;">
						</div>
						<div class="name">{{d.name}}</div>
						<div class="edu">{{d.graduateSchool}}</div>
					</div>
				</a>
			</div>
		</div>
	</div>
</div>	
</script>

<script type="text/javascript">
layui.use(['layer', 'form', 'formX', 'setter', 'mynotice', 'admin', 'ax', 'util', 'dataGrid', 'element'], function () {
    var $ = layui.jquery;
    var layer = layui.layer;
    var form = layui.form;
    var formX = layui.formX;
    var setter = layui.setter;
    var mynotice = layui.mynotice;
    var admin = layui.admin;
    var $ax = layui.ax;
    var util = layui.util;
    var dataGrid = layui.dataGrid;
    var element = layui.element;
    
    var Buyinghouse = {
    	ins: {},
    	pattern: /^1(3|4|5|7|8)\d{9}$/,
    	dataGridRender:() => { // 渲染数据列表
    		Buyinghouse.ins = dataGrid.render({
    	        elem: '#wdList',  // 容器
    	        templet: '#itemlist',  // 模板
    	        url: '/zp/question/qlist',  // 数据接口
    	        loadMore: {
    	        		limit: 10,
    	        		text: '点击加载更多',
    	        		loadingText: '<div class="loading-waiting" style=""><img src="//static.julive.com/m/images/haderline-loading.png?t=20200715_205041" alt="loading" title="loading" class="loading-img"> 更多精彩内容加载中… </div>',
    	        		noMoreText: '<div class="go-ask go-ask-project"><p>没有更多问答啦，更多疑问可以直接提问哦~</p></div>',
    	        		errorText: '加载失败，请重试',
    	        	},  // 开启分页
    	        done: function(res, curr, count){
    	        	
    	        }
    	    });
    		dataGrid.on('tool(wdList)', function (obj) {
                var modeldata = obj.data;
                if (obj.event === 'xtzx') {
                	admin.open({
            			type: 1,
            			title: false,
            			offset: 'auto',
            			closeBtn: 0,
            			skin: 'yourclass',
            			area: ['500px', '390px'],
            			content: $('#dialogform').html(),
            			success: function(layero, dIndex){
            				$(layero).children('.layui-layer-content').css('overflow', 'visible'); 
            				/*提交问题*/
            			    form.on('submit(questionsubmit)', function(data){
            			    	if(!Buyinghouse.pattern.test(data.field.phone)){
            		        		$("#erroMsg").removeClass('layui-hide');
            		            	return false;
            		        	}
            			    	layer.close(dIndex);
            			    	mynotice.load('提交中，请稍后...');
                			    var ajax = new $ax('/zp/question/add', 'post', function (res) {
                			    	mynotice.destroy();
                			    	admin.open({
                    	    			type: 1,
                    	    			title: false,
                    	    			offset: 'auto',
                    	    			closeBtn: 0,
                    	    			skin: 'yourclass',
                    	    			area: '500px',
                    	    			content: $('#dialogSuccessform').html(),
                    	    			success: function(layero, dIndex){
                    	    				$(layero).children('.layui-layer-content').css('overflow', 'visible'); 
                    	    			}
                    				})
                			    }, function (res) {
                			    	mynotice.destroy();
                			    	mynotice.error(res.msg);
                			    });
                			    data.field.consultant = modeldata.consultant;
                			    ajax.setData(JSON.stringify(data.field));
                			    ajax.start();
            				    return false;
            			    });
            			}
            		})
                }
            });
    	}
    	
    }
    
    Buyinghouse.dataGridRender();
    
    //监听提交
    form.on('submit(searchformBtn)', function(data){
    	Buyinghouse.ins.reload({where: data.field}); 
    	return false;
    });
    
    util.event('lay-event', {
    	seac: function(){
    		if(!$(this).hasClass('on')){
    			var id = $(this).data('id');
    			$('.on').removeClass('on');
    			$(this).addClass('on');
    			Buyinghouse.ins.reload({where: {questionType: id} }); 
    		}
    		
    	}
    })
    
});

</script>
	
</body>
</html>